<% if available_locales.length > 1 %>
  <div class="menu-bar__language-chooser-mobile">
    <div class="main-footer__language-container">
      <button id="dropdown-trigger-language-chooser-mobile" data-controller="dropdown" data-target="dropdown-menu-language-chooser-mobile" class="main-footer__language-trigger">
        <span class="mobile-holder">
          <%= icon "global-line" %>
          <span><%= t("name", scope: "locale" ) %></span>
        </span>
        <%= icon "arrow-down-s-line" %>
        <span class="sr-only" lang="<%= locale %>">
          <%= t("layouts.decidim.language_chooser.choose_language") %>
        </span>
      </button>

      <div id="dropdown-menu-language-chooser-mobile" aria-hidden="true">
        <ul class="main-footer__language" role="menu">
          <% available_locales.each do |locale| %>
            <li class="text-black text-md hover:bg-secondary hover:text-white <%= "is-active" if I18n.locale.to_s == locale %>" role="presentation">
              <%= link_to locale_name(locale), decidim.locale_path(locale:), method: :post, role: "menuitem", lang: locale, class: "p-2 w-full block" %>
            </li>
          <% end %>
        </ul>
      </div>
    </div>
  </div>
<% end %>
